<template>
	<view class="box">
		<!-- 首页头部 -->
		<view class="box-header">
			<view class="address">
				<view class="locationIcon">
					<u-icon name="map" size="24"></u-icon>
				</view>
				<view class="information">  
					<view v-if="isDefault==0">
						<view class="user">
							<view class="userDefault">暂无默认收货地址</view>
						</view>
					</view>
					<view v-else>
						 <view class="user">
						 	<text class="userName">{{user.recipientName}} {{user.contactNumber}}</text>
						 </view>
						 <view class="provinceCityArea">
							 <view class="province">{{user.provincee}} {{user.cityy}} {{user.areaa}} {{user.specificAddress}}</view>
						 </view>
					</view>
				</view>
			</view>
		</view>
		<view class="box-body">
			<view class="myAddress">
				<text class="myshouAddress">我的收货地址</text>
				<text class="addAddress" @click="newAddress">添加</text>
			</view>
			<view class="myAddressFor">
				<view class="myAddressItem"  v-for="(item,index) in userAddress" :key="index">
					<view class="locationIcon">
						<u-icon name="map" size="24"></u-icon>
					</view>
					<view class="information">
						<view class="user">
							<text class="userName">{{item.recipientName}} {{item.contactNumber}}</text>
						</view>
						<view class="provinceCityArea">
							<view>{{item.provincee}} {{item.cityy}} {{item.areaa}} {{item.specificAddress}} </view>
						</view>
					</view>
					<view class="selectedByDefault">
						<u-checkbox-group placement="column" :model="checkedValue">
							<u-checkbox
								:customStyle="{marginBottom:'8px'}"
								:checked=item.checked
								activeColor="#1BBC9B"
								@change="changeCheck(item,index)"
							></u-checkbox>
						</u-checkbox-group>
					</view>
				</view>
			</view>	
		</view>
		<view class="box-foot">
			<u-tabbar>
				<u-button color="#1BBC9B" @click="formsubmit" class="customStyle">确定收获地址</u-button>
			</u-tabbar>
		</view>
	</view>
</view>
</template>

<script>
	//查询当前用户默认地址
	import {selectUserDefaultCity} from "@/static/http/getData.js"
	//查询用户的所有的收货地址
	import {selectJsAddressAll} from "@/static/http/getData.js"
	//修改用户的默认地址
	import {updateUserIsDefault} from "@/static/http/getData.js"
	//将当前用户所有的地址都改成非默认
	import {updateUserNoDefault} from "@/static/http/getData.js"
	
	export default{
		data(){
			return{
				//当前用户默认地址
				user:[],
				//当前用户所有的地址
				userAddress:[],
				//所有复选框的状态
				checkedValue:[],
				isDefault:0
			}
		},
		onLoad(){
			//查询当前用户默认地址
			this.selectUserDefaultCity();
			//查询用户的所有的收货地址
			this.selectJsAddressAll();
		},
		activated() {
			//查询当前用户默认地址
			this.selectUserDefaultCity();
			//查询用户的所有的收货地址
			this.selectJsAddressAll();
		},
		methods:{
			//查询当前用户默认地址
			selectUserDefaultCity(){
				var data1 ={
					userId:89,
					isDefault:2
				};
				//开始查询当前用户默认地址
				selectUserDefaultCity(data1).then(res=>{
					var defaultt = res.data.data;
					if(defaultt.length==0){
						this.isDefault=0;
					}else{
						this.isDefault=1;
						for (var i = 0; i < defaultt.length; i++) {
							this.user = defaultt[i];
						}
						return;
					}
				})
			},
			//查询用户的所有的收货地址
			selectJsAddressAll(){
				var data1={
					userId:89
				};
				//开始查询用户的所有的收货地址
				selectJsAddressAll(data1).then(res=>{
					this.userAddress = res.data.data;
					var ress = res.data.data;
					for (var i = 0; i < ress.length; i++) {
						this.checkedValue.push(ress[i].checked);
					}
				})
			},
			//监听复选框
			changeCheck(e,index){
				if(this.checkedValue[index]==true&&this.userAddress[index].checked==true){
					this.checkedValue[index]=false;
					this.userAddress[index].checked = false;
				}else{
					for (var i = 0; i < this.userAddress.length; i++) {
						this.checkedValue[i]=false;
						this.userAddress[i].checked=false;
					};
					this.checkedValue[index]=true;
					this.userAddress[index].checked=true;
				}
			},
			//确定收货地址
			formsubmit(){
				var count = 0;
				var addressId = 0;
				for (var i = 0; i < this.userAddress.length; i++) {
					if(this.userAddress[i].checked==true){
						count+=1;
						addressId = this.userAddress[i].addressId
					}
				}
				if(count!=0&&count>0){
					var data1={
						addressId:addressId,
						isDefault:2,
						userId:89,
						isDefaultt:3
					};
					
					updateUserIsDefault(data1).then(res=>{
						if(res.data.data==true){
							uni.showToast({
								icon:"success",
								title:"修改默认地址成功",
								duration:2000
							});
							this.$router.back();
						}else{
							uni.showToast({
								icon:"error",
								title:"修改默认地址失败",
								duration:2000
							});
							this.$router.back();
						}
					});
				}else{
					var data2={
						userId:89,
						isDefaultt:3
					};
					updateUserNoDefault(data2).then(res=>{
						if(res.data.data==true){
							uni.showToast({
								icon:"success",
								title:"修改默认地址成功",
								duration:2000
							});
							this.$router.back();
						}else{
							uni.showToast({
								icon:"error",
								title:"修改默认地址失败",
								duration:2000
							});
							this.$router.back();
						}
					})
				}
			},
			//添加地址
			newAddress(){
				uni.navigateTo({
					url:"/pages/shopping/newAddress"
				})
			}
		}
	}
</script>

<style>
	*{
		margin:0;
		padding:0;
	}
	.box{
		margin:10px auto;
		width:100%;
	}
	.box .box-header{
		margin: 0 auto;
		width:96%;
		height:70px;
		border-radius:15px;
	}
	.box .box-header .address{
		width:100%;
		height:70px;
		line-height:26px;
		border-radius:10px;
		background-color:#FFFFFF;
	}
	.box .box-header .address .locationIcon{
		float: left;
		width:8%;
		margin:24px 0px 0px 10px;
	}
	.box .box-header .address .information{
		float: right;
		width:82%;
		font-size:16px;
		margin: 8px 20px 0px 0px;
	}
	.box .box-header .address .information .user .userName{
		font-weight: bold;
	}
	.box .box-body .address .information .user .phone{
		padding-left:10px;
	}
	
	.box .box-header .address .information .user .userDefault{
		margin-top:13px;
	}
	.box .box-body .myAddress{
		margin:20px auto;
		width:96%;
		height:50px;
		line-height:50px;
		font-size:15px;
		border-top-left-radius:15px;
		border-top-right-radius:15px;
		border-bottom:1px solid #909399;
		background-color:#FFFFFF;
	}
	.box .box-body .myAddress .myshouAddress{
		float: left;
		padding-left:10px;
	}
	.box .box-body .myAddress .addAddress{
		float: right;
		font-weight:bold;
		padding-right: 10px;
	}
	.box .box-body .myAddressFor{
		margin-top:-20px;
	}
	.box .box-body .myAddressItem{
		margin:0 auto;
		width:96%;
		height:110px;
		line-height:25px;
		background-color:#FFFFFF;
		border-bottom: 1px solid #D8D8D8;
	}
	.box .box-body .myAddressItem .locationIcon{
		float: left;
		width:10%;
		margin:24px 0px 0px 10px;
	}
	.box .box-body .myAddressItem .information{
		float: left;
		width:74%;
		font-size:16px;
		margin-top: 8px;
	}
	.box .box-body  .selectedByDefault{
		width:6%;
		float:right;
		margin:30px 10px 0px 0px;
	}
	.box .box-foot .customStyle{
		margin:0 auto;
		width:90%;
		height:50px;
	}
	.province{
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
</style>
